import React,{ useEffect,useRef,useState } from 'react'
import { View,Text,Image } from '@tarojs/components'
import './index.less'
import VirtialList from '@/components/VirtualList'
import { useDidShow } from '@tarojs/taro';
import { Store } from '@/store/core.store';
import UserStore from '@/store/user.store';
import { DeployModules } from 'types/deploy'
const baseCls = `legions-deploy`;
import useList from '@/hook/pageList';
import get from 'lodash/get';
import { routers } from '@/router';
import Taro from '@tarojs/taro';
import { deployService } from '@/api/deploy.service';
import DeployStore from '@/store/deploy.store';
import { auditStatusEnum } from '@/constants/audit.enum';
export default function Deploy() {
  const store = Store.getStore(UserStore)
  const deploy_store = Store.getStore(DeployStore)

  const [audit_status,setAuditStatus] = useState(0);
  const list_service = useList<DeployModules.List>({
    request: async (page,size) => {
      const res = await deployService.getList({
        pageIndex: page,
        pageSize: size,
        developer_assign_status: audit_status
      })
      return {
        data: get(res,'data.list',[]),
        total: get(res,'data.total')
      }
    },
    default_page_size: 20,
  })

  useEffect(() => {
    list_service.getList()
  },[])

  useDidShow(() => {
    store.authentication();
  })
  const onSearch = (_audit_status: number) => {
    if (_audit_status !== audit_status) {
      setAuditStatus(_audit_status);
    }
    list_service.onSearch();
  }
  const onGotoDetail = (item) => {
    deploy_store.setDetail(item);
    Taro.navigateTo({
      url: routers.deploy_detail,
    })
  }
  return (
    <View className={baseCls}>
      <View className='panel__content'>
        <View className='tabs'>
          <View className='header'>
            <View className='item ' onClick={onSearch.bind(this,0)}>
              待审核
              {audit_status === 0 && <View className='active'></View>}
            </View>
            <View className='item' onClick={onSearch.bind(this,1)}>
              已审核
              {audit_status === 1 && <View className='active'></View>}
            </View>
          </View>

          <View className='body'>

            {list_service.list.length ? <VirtialList
              list={list_service.list}
              segmentNum={list_service.page_size.current}
              pageNum={list_service.curr_page.current}
              listType='multi'
              autoScrollTop={false}
              onRender={(item: DeployModules.List) => {
                return (
                  <View key={item._id} id={`${item._id}`} className='item'>
                    <View className='content' onClick={onGotoDetail.bind(this,item)}>
                      <Text className='title'>
                        发布标题：{item.release_title}
                      </Text>
                      <Text className='title desc'>
                        发布内容：{item.release_content}
                      </Text>
                      <Text className='li'>
                        项目名称：{item.repository_name}
                      </Text>
                      <Text className='li'>
                        来源分支：{item.source_branch}
                      </Text>

                      <View className='li'>
                        <View className={`name ${item.developer_assign_status===auditStatusEnum.waiting?'disabled':''}`}>
                          <Text className='text'>开发</Text>
                        </View>
                        <View className={ `direction ${item.developer_assign_status===auditStatusEnum.waiting?'disabled':''}`}><Image className='image' src='https://hoolinks-frontend-resources.oss-cn-shenzhen.aliyuncs.com/images/weapp-to.png'></Image></View>
                        <View className={`name ${item.devops_assign_status===auditStatusEnum.waiting?'disabled':''}`}>
                          <Text className='text'>运维</Text>
                        </View>
                        <View className={`direction ${item.devops_assign_status===auditStatusEnum.waiting?'disabled':''}`}><Image className='image' src='https://hoolinks-frontend-resources.oss-cn-shenzhen.aliyuncs.com/images/weapp-to.png'></Image></View>
                        <View className={`name ${item.deploy_status===auditStatusEnum.waiting?'disabled':''}`}>
                          <Text className='text'>部署</Text>
                        </View>
                      </View>

                    </View>

                  </View>
                )
              }}
              scrollViewProps={{
                style: {
                  "height": '100vh',
                },
                onScrollToLower: list_service.onPageScrollToLower,
                lowerThreshold: 50,
              }}
            /> : <View className='empty'>
              <Image className='image' src='https://hoolinks-frontend-resources.oss-cn-shenzhen.aliyuncs.com/images/weapp-empty.png'></Image>
              <Text className='text'>暂无数据</Text>
            </View>}
          </View>
        </View>
      </View>
    </View>
  )
}
